<template>
  <div id="nav">

      <!-- <Nav></Nav> -->
      <!-- 路由占位符 -->
      <router-view></router-view>

      <PlayButton v-if="currentMusic.id" :class="{'play-btn':showTab, 'play-btns':!showTab}"></PlayButton>
  </div>
</template>

<script>
import PlayButton from './components/playButton.vue'
import { mapState, mapMutations } from 'vuex'
export default {
  props: {
    requiresAuth: Boolean
  },
  data () {
    return {

    }
  },
  computed: {
    ...mapState(['showTab', 'currentMusic'])

  },
  created () {
    console.log('current', this.currentMusic)
  },
  methods: {
    ...mapMutations(['getCurrentMusic'])
  },

  components: {
    PlayButton

    // Nav
  }
}
</script>

<style scoped lang="less">

 #nav{
  position: relative;
  // width: 100vw;
  // height: 100vw;

}
.play-btn{
  position: sticky;

  background-color: #969799;
  position: fixed;
  bottom: 50px;
}
.play-btns{
    background-color: #969799;
  position: fixed;
  bottom: 0;
}

</style>
